// 基于axios封装网络请求的函数，统一管理，统一修改
// 引入axios包
import axios from 'axios'
import store from '@/store/index'
import router from '@/router/index'
import { Message } from 'element-ui'

export const baseURL = 'http://big-event-vue-api-t.itheima.net'

// Vue.prototype.baseURL = 'http://big-event-vue-api-t.itheima.net'

// axios.create()创建一个带配置项的自定义axios函数
// myAxios请求的时候，地址是baseURL+url，不用再写基本地址，就可以去请求后台
const myAxios = axios.create({
  // 配置网络请求基本地址
  baseURL: baseURL
})

// 定义-请求拦截器
myAxios.interceptors.request.use(function (config) {
  // 在请求前会触发一次
  // 它返回给axios内源码，config配置对象（要请求后台的参数都在这个对象上）
  // 判断：登录和注册不需要token
  if (store.state.token) {
    config.headers.Authorization = store.state.token
  }
  return config
}, function (console) {
  // 请求前发起的代码，如果有异常报错，会直接进入这里
  // 返回一个拒绝状态的Promise对象（axios留在原地的Promise对象状态就为失败结果为error变量值）
  // 类似于catch函数（）里的return
  return Promise.reject(console)
})

// 定义-响应拦截器
myAxios.interceptors.response.use(
  function (response) {
    // 响应http状态码为2xx或3xx时触发成功的回调函数，形参中的response是成功的结果
    // return到axios原地的Promise对象，作为成功的结果
    return response
  },
  function (error) {
    // 响应http状态码为4xx或5xx时触发成功的回调函数，形参中的response是成功的结果
    // return到axios原地的Promise对象位置，作为失败拒绝的状态
    // 如果那边用try和catch或catch函数捕获，可以捕获到我们这边传递过去的这个error变量的值
    if (error.response.status === 401) {
      // 本次响应式token过期
      // 清除vuex中的一切，并且返回登录页面（被动退出登录）
      store.commit('updateToken', '')
      store.commit('updateUserInfo', '')
      Message.error('用户身份已过期，请重新登录')
      router.push('/login')
    }
    return Promise.reject(error)
  }
)

// 导出axios自定义函数
export default myAxios
